const statusClassMap = {
  success: 'progress--success',
  warning: 'progress--warning',
  error: 'progress--error'
};

Component({
  options: {
    addGlobalClass: true
  },

  properties: {
    value: {
      type: Number,
      value: 0
    },
    max: {
      type: Number,
      value: 100
    },
    label: {
      type: String,
      value: ''
    },
    showValue: {
      type: Boolean,
      value: true
    },
    status: {
      type: String,
      value: ''
    },
    striped: {
      type: Boolean,
      value: false
    }
  },

  data: {
    clampedValue: 0,
    statusClass: ''
  },

  lifetimes: {
    attached() {
      this.updateProgress();
    }
  },

  observers: {
    'value, max, status'() {
      this.updateProgress();
    }
  },

  methods: {
    updateProgress() {
      const max = this.properties.max > 0 ? this.properties.max : 100;
      const raw = (this.properties.value / max) * 100;
      const clampedValue = Math.max(0, Math.min(100, Math.round(raw)));
      const statusClass = statusClassMap[this.properties.status] || '';
      this.setData({ clampedValue, statusClass });
    }
  }
});
